<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--<meta name="viewport" content="width=device-width, 2.initial-scale=1.0, 3.maximum-scale=1.0, 4.user-scalable=no">-->
    <link rel="stylesheet" href="__CSS__/bootstrap.min.css">
    <link rel="stylesheet" href="__CSS__/curriculum.css">
    <!--<link href="__CSS__/admin/Course/addcourse.css" rel="stylesheet">-->
    <link href="__CSS__/admin/Website/addmodule.css" rel="stylesheet">
    <link href="__CSS__/style.css?v=4.1.0" rel="stylesheet">
    <link href="__CSS__/animate.css" rel="stylesheet">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <![endif]-->
    <script src="__JS__/jquery-1.11.3.js"></script>
    <script src="__JS__/bootstrap.min.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
    <script src="http://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>




<body>

<div class="index container">
    <div class="col-sm-12 col-xs-12 ">
        <a  class="btn btn-lg btn-danger"   href='javascript:history.go(-1)'>返回</a>
    </div>
    <form id="forms" action="{:url('Website/add_moduletrue')}" method="post">
        <div><div class="title">添加课程名字</div>  <input type="text" style="margin-left: 7rem" name="name"  onsubmit="submit()" value=""></div>

        <div> <div class="title">内容1</div>
        <div class="btn-group">
            <button type="button" class="btn btn-default">课程</button>
            <button type="button" class="btn btn-default dropdown-toggle"
                    data-toggle="dropdown">
                <span class="caret"></span>
                <span class="sr-only">切换下拉菜单</span>
            </button>
            <ul class="dropdown-menu heightall" role="menu">
                {volist name="class" id="value1"}
                <li  onclick="changges(1,'{$value1.record_name}')">{$value1.record_name}</li>
                {/volist}
            </ul>
        </div>
        <select  name="content1"  id="select1" style="display: inline-block;">
        </select>
        </div>
        <div> <div class="title">内容2</div>
        <div class="btn-group">
            <button type="button" class="btn btn-default">课程</button>
            <button type="button" class="btn btn-default dropdown-toggle"
                    data-toggle="dropdown">
                <span class="caret"></span>
                <span class="sr-only">切换下拉菜单</span>
            </button>
            <ul class="dropdown-menu heightall" role="menu">
                {volist name="class" id="value2"}
                <li  onclick="changges(2,'{$value2.record_name}')">{$value2.record_name}</li>
                {/volist}
            </ul>
        </div>
        <select  name="content2" id="select2" style="display: inline-block;"  >

        </select>
        </div>
        <div> <div class="title">内容3</div>
        <div class="btn-group">
            <button type="button" class="btn btn-default">课程</button>
            <button type="button" class="btn btn-default dropdown-toggle"
                    data-toggle="dropdown">
                <span class="caret"></span>
                <span class="sr-only">切换下拉菜单</span>
            </button>
            <ul class="dropdown-menu heightall" role="menu" >
                {volist name="class" id="value3"}
                <li  onclick="changges(3,'{$value3.record_name}')">{$value3.record_name}</li>
                {/volist}
            </ul>
        </div>
        <select  name="content3"  id="select3" style="display: inline-block;"  >


        </select>
        </div>

            <button type="submit" class="btn btn-lg center-block">确认添加</button>
    </form>
</div>
</body>
</html>
<script>
    var chengeurl="{:url('Website/addchange')}";
    function changges(selectid,classname) {

        $.ajax({
            url: chengeurl,
            type: "post",
            dataType: "json",
            data: {
                classname:classname
            },
            success: function (data) {
                $("#select"+selectid).empty();
                for (var i = 0; i < Object.keys(data).length; i++) {  //获取data长度   循环遍历出来
                    $("#select"+selectid).append('<option value=' + data[i].id + '>' + data[i].record_name + '</option>')
                }
            },
            error: function (e) {
                alert(e.response)
            }
        })
    }
    $("#forms").validate({
        rules:{
            name:{
                required:true,
            },
            content1:{
                required:true
            } ,
            content2:{
                required:true
            },
            content3:{
                required:true
            }
        }
    })
    $.validator.setDefaults({
        submitHandler: function() {

            submit();
        }
    });
</script>